// 获取 ul 元素
const ul = document.querySelector("ul");
// 定义委托函数
function delegate(parent, selector, type, callback) {
  // 为父元素添加事件监听器
  parent.addEventListener(type, function (e) {
    // 获取触发事件的目标元素
    let target = e.target;
    // 判断目标元素是否匹配子元素选择器
    if (target.matches(selector)) {
      // 如果是，就执行原始的回调函数，并传入目标元素和事件对象
      callback(target, e);
    } else {
      // 如果不是，就向上遍历其祖先元素
      while (target !== parent) {
        // 获取目标元素的父元素
        target = target.parentNode;
        // 判断父元素是否匹配子元素选择器
        if (target.matches(selector)) {
          // 如果是，就执行原始的回调函数，并传入父元素和事件对象
          callback(target, e);
          // 跳出循环
          break;
        }
      }
    }
  });
}
// 使用委托函数为 ul 中的 li 元素添加点击事件
delegate(ul, "li", "click", function (li, e) {
  // 在控制台打印出 li 的内容
  console.log(li.textContent);
});
